<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<p>111</p>
		<p>
			<span class="one">111</span>
		</p>
		<p></p>
		<p>222</p>
		
		<div style="display: none;">aaa</div>
		<div>bbb</div>
		
		<script src="jquery.min.js"></script>
		<script>
			//:contains(xxx) 内容中含有xxx
			console.log($("p:contains(1)"));
			
			//:empty 没有内容的
		    $("p:empty").css("border","1px solid red");
			
			//:parent 必须有内容
			$("p:parent").css("border","1px solid blue");
			
			//内容含有某个选择器  含有 .one 这种选择器
			$("p:has(.one)").css("background-color","pink");
			
			console.log($("div:visible"));//可见的
			console.log($("div:hidden"));//不可见的
		</script>
	</body>
</html>
